2025

(10/7)

light box

Notes


<style>
/* Style for the overlay */
#lightbox {
  display: none;
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.8);
  text-align: center;
}
#lightbox img {
  max-width: 90%;
  max-height: 80%;
  margin-top: 5%;
  border-radius: 4px;
}
#lightbox span {
  position: absolute;
  top: 20px;
  right: 35px;
  color: white;
  font-size: 40px;
  cursor: pointer;
  font-weight: bold;
}
</style>

<!-- Thumbnail -->
<img src="/Nyu Gallery/icon/skyfall-icon.png" alt="Full image" width="250" onclick="openLightbox('/Nyu Gallery/2019/skyfall.png')" style="cursor:pointer;">

<!-- Overlay -->
<div id="lightbox">
  <span onclick="closeLightbox()">×</span>
  <img id="lightbox-img" src="" alt="Full view">
</div>

<script>
function openLightbox(url) {
  document.getElementById("lightbox").style.display = "block";
  document.getElementById("lightbox-img").src = url;
}
function closeLightbox() {
  document.getElementById("lightbox").style.display = "none";
}
</script>

10/8

“HTML escaping” or “HTML entity encoding.”

It basically means converting special HTML characters like <, >, and " into their safe text equivalents (<, >, ") so the browser displays them instead of interpreting them.

Neocities’ built-in editor: Find and Replace

When you’re editing a file, press Ctrl + F (or Cmd + F on Mac) to open the find bar at the bottom. Then click the “.*” icon or “Aa” toggle (depending on your browser) to switch to “Replace” mode — or just hit Ctrl + H (Cmd + H on Mac). That opens the replace field. You can type < in the “Find” box and < in the “Replace” box, and hit Replace All. Do the same for > → > and " → ". If Neocities’ online editor feels clunky, just download the file, open it in a real text editor like VS Code or Notepad++, do the replacements there, and re-upload. It’s way faster when you’ve got a lot of tags to escape.

10/12/25

embed

iframe src="https://example.com" width="800" height="600" /iframe

hotlinking (aka stealing by embedding XD)

img src="https://example.com/image.gif" alt="Description"

10/13/25

bullet list

< ul > hi
< li >First item< /li >
< li >Second item< /li >
< li >Third item< /li >
If you want numbered lists instead, you’d use < ol > instead of < ul >.)
    hi
  1. First item
  2. Second item
  3. Third item
< ul > hi
< li >First item< /li >
< li >Second item< /li >
< li >Third item< /li >
(there is literally no limit to the bullet points XD. its only the matter of whether your pc or phone can handle it >:D)

line break(< br >tag)

First line
Second line
Third line

just add it at the end of the line you wanna skip
First line< br >
Second line< br >
Third line
(its basically outsourcing the skip function from enter key to this tag smh)

10/18/25 - strating from scratch in w3s

HTMl

HyperText Markup Languague is the standard markup language in web dev

markup language

XML and HTML are markup language

XML

Used for storing and transporting data in a structured format.

element

title

title and /title indicates the websites tab title display and when user hovering their mouse over website tabs

empty element

anchor tag

10/19

element

tags are part of an element, not the same thing

tags

10/20

tags

attributes

exist inside tags like <a>

there can me bore than one attributes in a tag
<a href="url" target="_blank" title="Click here" class="link">

10/28

Content Delivery Network(CDN)